﻿<script src="~/lib/vue/dist/vue.global.js"></script>
<link href="~/lib/element-plus/dist/index.css" rel="stylesheet" />
<script src="~/lib/element-plus/dist/index.full.js"></script>
<script src="~/lib/axios/dist/axios.js"></script>
<div id="app">
	<table width="100%">
		<tr>
			<td>
				<p color="black">您正在做的业务是:人力资源--调动管理--调动审核列表</p>
			</td>
		</tr>
	</table>
	<el-table :data="tableData" style="width: 100%" :header-cell-style="{background:'#FFDB6F',color:'#606266'}">
		<el-table-column prop="firstKindName" label="I级机构名称" min-width="120%"></el-table-column>
		<el-table-column prop="secondKindName" label="II级机构名称" min-width="120%"></el-table-column>
		<el-table-column prop="thirdKindName" label="III级机构名称" min-width="120%"></el-table-column>
		<el-table-column prop="salaryStandardName" label="薪酬标准" min-width="120%"></el-table-column>
		<el-table-column prop="humanName" label="名字" min-width="120%"></el-table-column>
		<el-table-column label="审核">
			<template #default="scope">
				<el-button size="small" v-on:click="handleEdit(scope.row)">
					审核
				</el-button>
			</template>
		</el-table-column>
	</el-table>
	<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize"
				   :page-sizes="[5, 10, 15, 20]" layout="total, sizes, prev, pager, next, jumper" :total="rows"
				   v-on:size-change="handleSizeChange" v-on:current-change="handleCurrentChange">

	</el-pagination>
</div>
<script>
	const { createApp, ref, reactive, computed, watchEffect } = Vue;
	var app = createApp({
		setup() {
			let tableData = ref([])
			const rows = ref(0);
			const currentPage = ref(1);
			const pageSize = ref(5);
			const isUse = ref(false);

			const Fill = () => {
				axios.defaults.headers["Content-Type"] = "application/x-www-form-urlencoded";
				axios.post('/ReviewMC/MCFYByCheckReason', {
					checkReason:1,
					page: currentPage.value,
					pageSize: pageSize.value,

				}).then(res => {
					console.info(res.data)
					tableData.value = res.data.mc;
					rows.value = res.data.totalRecords;

				})


			}
			Fill();
			// 处理每页显示数量变化
			const handleSizeChange = (size) => {
				pageSize.value = size;
				Fill();
				isUse.value = true;
			};

			// 处理当前页变化
			const handleCurrentChange = (cpage) => {
				currentPage.value = cpage;
				Fill();
				isUse.value = true;
			};
			function handleEdit(row) {
				console.info(row)
				const queryParams = new URLSearchParams();
				 queryParams.set('rowData', JSON.stringify(row));
				 window.location.href = `/ReviewMC/Index1?${queryParams.toString()}`;
			}
			return {
				tableData,
				rows,
				currentPage,
				pageSize,
				isUse,
				
				handleCurrentChange,
				handleSizeChange,
				handleEdit

			}
		}
	})
	app.use(ElementPlus);
	app.mount("#app");
</script>

<style type="text/css">
	body {
		background-color: #FFFFBB;
		border: 1px solid #FFDB6F;
		display: block;
		margin: 8px;
	}

</style>